/**
 * Customize configuration environment
 * This will overwrite the default environment. you can write to adapt to the project
 */
import InitServeConfig from './config/index.ts'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'
import initVitePlugin from './vite-plugins/index.ts'
import type { UserConfig } from 'vite'

export default {
  resolve: {
    dedupe: ['vue'],
  },
  css: {
    preprocessorOptions: {
      scss: {
        /**
         * Note that if you include actual styles and not just variables. Those styles will be duplicated in the final bundle.
         * @use only applies to the current file. If this file imports other SCSS files,
         * the additionalData configured in Vite will not be injected into those imported files.
         */
        additionalData: [
          `@use '@/style/mixins/function.scss' as *;`,
          `@use '@/style/mixins/utils.scss' as *;`,
        ].join(''),
      },
    },
  },
  /**
   * If there are non default static resources in the project, please add them in assetsInclude
   * Vite supports the following static asset types by default:
   * Images: JPEG/JPG, PNG, SVG, GIF, WebP, AVIF; Fonts: WOFF/WOFF2, EOT, TTF, OTF;
   * Audio/Video: MP4, WebM, OGG, MP3, WAV, FLAC; Text: JSON, Markdown, CSV; Styles: CSS, SCSS, LESS
   */
  // if you want to add gltf resources. assetsInclude: ['**/*.gltf']
  assetsInclude: [],
  // Server Options:https://vite.dev/config/server-options.html
  server: {
    port: 8080,
    host: '0.0.0.0',
    allowedHosts: [], // restricted range host when run development
    proxy: InitServeConfig.getProxy(process.env.NODE_ENV ?? ''),
    cors: true, // allowed any origins. this only run in development
    warmup: {
      clientFiles: [], //  used in the client only
      ssrFiles: [], // used in SSR only.
    },
  },
  plugins: [
    vue(),
    ...(process.env.NODE_ENV === 'development' ? [vueDevTools()] : []),
    ...initVitePlugin(),
  ],
} satisfies UserConfig
